import React, { Component } from 'react';
import '../styles/Down.scss'
class Down extends Component {
    constructor(props){
        super(props)
        this.state={
            currentIndex:0,
            list:[
                {name:'店铺'},  {name:'分类'},  {name:'全部商品'},  {name:'购物车'},{name:'个人中心'},
            ]
        }
    }

   downClick(index){
       this.setState({ currentIndex: index })
   }

    render() {
        return (
            <div className='down'>
                {
                    this.state.list.map((item,index)=>{
                        return(
                            <div className={'item ' + (this.state.currentIndex == index ? 'active' : '')} key={index} onClick={() => { this.downClick(index) }}>
                         
                         <div className="name">{item.name}</div>

                        </div>

                        )
                    })
                }
            </div>
        );
    }
}

export default Down;